<template>
  <div class="aid">
    <div class="base">
      <p class="fixed-top">
		  <span v-if="approvalType!=6"> {{ approvalList.ConfirmState }}</span>
		  <span v-else>待初审</span>
        <a-icon @click="closeFunction" type="close" />
      </p>
      <div class="main" id="new_message">
        <a-form :form="form" @submit="handleSubmit">
          <a-form-item label="审核状态" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
           	<a-select :allowClear="true" v-decorator="['selectvalue',{ rules: [{ required: true, message: '请选择审核状态' }] }]">
           		<a-select-option v-for="(item, index) in TypeList" :key="index" :value="item.Key">{{ item.Value }}</a-select-option>
           	</a-select>
          </a-form-item>
          <a-form-item label="内容" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
			  <a-textarea placeholder="请输入内容"  v-decorator="['content']"></a-textarea>
		  </a-form-item>
		  <a-form-item label="审核人" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
		    {{ Name }}
		  </a-form-item>
          <a-form-item class="fixed-bottom"><a-button type="primary" html-type="submit" class="btn2">提交</a-button></a-form-item>
        </a-form>
      </div>
    </div>
  </div>
</template>

<script>
import Cache from '@/utils/cache'
import { DoSubmitConfirm ,GetConfirmState } from '@/api/follow'
export default {
	props: {
		approvalList: '',
		approvalType: ''
	},
	data() {
		return {
			formLayout: 'horizontal',
			form: this.$form.createForm(this, { name: 'coordinated' }),
			salesmansourcelist: [{ ID: 1, Name: '经销商端' }, { ID: 2, Name: '办事处端' }],
			salesmanlist: [],
			worklist: [],
			TypeList: [],
			selecttype: 1,
			type: ['待初审'],
			Name: Cache.get('info').Name,
			selectvalue:1,
			content:'',
			menuTypeList:[
				{ ID:"1", Name:"待审核" }, { ID:"2", Name:"驳回" }, { ID:"3", Name:"待复审" }, { ID:"4", Name:"待复审审核" }, { ID:"5", Name:"通过" }, { ID:"6", Name:"待初审" }, { ID:"7", Name:"待初审复审" }
			]
			
		}
	},
	async created() {
		await this.GetConfirmState()
	},
	methods: {
		async GetConfirmState(){
			let res = await GetConfirmState()
			this.TypeList=res.data.data
		},
		radioOnChange(e) {
			this.selectvalue = e.target.value
		},
		filterOption(input, option) {
			return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
		},
		closeFunction() {
			// this.selecttype = 0
			this.worklist = []
			this.$emit('closeFun')
		},
		roleChange(value) {},
		departmentChange(value) {},
		handleSubmit(e) {
		let data={}
		data.ID = this.approvalList.ID
		data.Type = this.approvalType
		data.Content  = this.content
		this.form.validateFields(async (err, values) => {
		        if (!err) {
					data.ConfirmState =Number(values.selectvalue)
					data.Content=values.content
				  let res = await DoSubmitConfirm(data)
				  if(res.data.code===1){
					  	this.$message.success(res.data.msg)
						this.$emit('closeFun')
						this.form.resetFields();
				  }else{
					  this.$message.error(res.data.msg)
				  }
		        }
		      });
			
		}
	}
}
</script>

<style lang="less" scoped>
.aid {
	position: fixed;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	top: 0px;
	left: 0px;
	z-index: 999;
}

.base {
	position: absolute;
	width: 600px;
	// height: 540px;
	height: auto;
	background: #fff;
	left: 50%;
	margin-left: -300px;
	top: 50%;
	margin-top: -270px;
	overflow-y: auto;
	.main {
		height: 90%;
		overflow-y: scroll;
	}
	/deep/.ant-form-item {
		margin: 20px 50px;
		/deep/.ant-form-item-label {
			width: 100px;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			text-align: right;
		}
		/deep/.ant-form-item-control-wrapper {
			flex: 1;
		}
		/deep/textarea {
			height: 140px;
		}
	}
}

.ant-form-item {
	margin-bottom: 10px;
}

.btn2 {
	display: -moz-box;
	-moz-box-pack: center;
	-moz-box-align: center;

	/* Safari、Opera 以及 Chrome */
	display: -webkit-box;
	-webkit-box-pack: center;
	-webkit-box-align: center;

	/* W3C */
	display: flex;
	box-pack: center;
	box-align: center;
	width: 137px;
	height: 35px;
	border-radius: 3px;
	outline: none;
	border: none;
	margin: 20px auto;
	color: #fff;
}
/deep/.ant-form {
	margin-top: 50px;
	padding-bottom: 80px;
}
</style>
